<!DOCTYPE html>

<html>

<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<link rel="dns-prefetch" href="http://fonts.googleapis.com/">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>OPMS-INDIA</title>
<meta name="description" content="">
<meta name="author" content="">
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="stylesheet" href="a_data/1105b53.css">

	

</head>
<body>
	<div id="height-wrapper">
		<header>
			<div id="header_toolbar"><!--this will contain login header for opms !-->
				<div class="container_12">
					<h1 class="grid_8">OPMS - INDIA</h1>
					<div class="grid_4"> <!--modify to login text box and login button  !-->
						<div class="toolbar_small">
							<div class="toolbutton">
								<span>3</span> <img src="a_data/mail.png" alt="mail" height="16"
									width="16">
							</div>
							<div style="display: none;" class="toolbox">
								<span class="arrow"> </span>
								<h3>Your Messages</h3>
								<ul class="mail">
									<li><a href="#"> <strong>10:15</strong>Need your Help!
											<small> From: John </small> </a></li>
									<li><a href="#"> <strong>9:55</strong>New comment on
											you theme <small> From: themeforest </small>
									</a></li>
									<li><a href="#"> <strong>Yest.</strong>Successfull
											backup <small> From: System </small>
									</a></li>
									<li class="read"><a href="#"> <strong>2 days</strong>Bug
											report <small> From: Jane </small>
									</a></li>
								</ul>
								<a class="inbox" href="#">Go to inbox »</a>
							</div>
						</div>
						<div class="toolbar_large"><!--modify to login text box and login button  !-->
							<div class="toolbutton">
								<div class="toolicon">
									<img src="a_data/user.png" alt="user" height="16" width="16">
								</div>
								<div class="toolmenu">
									<div style="min-width: 43px;" class="toolcaption">
										<span>Administrator</span>
									</div>
									<div style="display: none;" class="dropdown">
										<ul>
											<li><a href="#">Settings</a></li>
											<li><a href="#">Logout</a></li>
										</ul>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<nav id="header_main">
				<div class="container_12">
					<ul id="nav_main">
						<li class="current"><a href="#"> <img src="a_data/computer-imac.png" alt="" height="25" width="25">
								Dashboard</a>
							<ul style="">
								<li><a
									href="#">Link 1</a>
								</li>
								<li><a
									href="#">Link 2</a>
								</li>
								<li><a
									href="#">Link 3</a>
								</li>
							</ul>
						</li>
						<li class=""><a href="#"> <img
								src="a_data/blocks---images.png" alt="" height="25" width="25">
								Reports</a>
							<ul style="display: block;">
								
								<li><a
									href="#">Link 1</a>
								</li>
								<li><a
									href="#">Link 2</a>
								</li>
								<li><a
									href="#">Link 3</a>
								</li>
								
							</ul>
						</li>
						<li class=""><a href="#"> <img
								src="a_data/user-comment.png" alt="" height="25" width="25">
								Profile</a>
							<ul style="">
								<li><a href="#">Link 1</a></li>
								<li><a href="#">Link 2</a></li>
								<li><a href="#">Link 3</a>
								</li>
							</ul>
						</li>
					</ul>
				</div>
			</nav>
			<div id="nav_sub"></div>
		</header>
		<div role="main" class="container_12" id="content-wrapper">
			<div id="main_content">
				<h2 class="grid_12">Forms</h2>
				<div class="clean"></div>
				<div class="grid_6">
					<div class="box">
						<div class="header">
							<img src="a_data/ui-text-field-format.png" alt="" height="16"
								width="16">
							<h3>Form</h3>
							<span></span>
						</div>
						<form class="validate" novalidate="novalidate" action=""
							method="get">
							<div class="content with-actions">
								<div class="_50">
									<p>
										<input name="username" placeholder=" Your Name"
											class="required" type="text">
									</p>
								</div>
								<div class="_50">
									<p>
										<input name="email" placeholder=" Your E-Mail"
											class="required" type="email">
									</p>
								</div>
								<div class="_100">
									<p>
										<label> Where are you from? </label> <select
											style="display: none;" id="selTCO" name="from"
											class="required chzn-done">
											<option selected="selected"></option>
											<option>Europe</option>
											<option>America</option>
											<option>Asia</option>
											<option>Africa</option>
										</select>
									<div style="width: 496px;"
										class="chzn-container chzn-container-single" id="selTCO_chzn">
										<a href="javascript:void(0)" class="chzn-single"><span>Select
												an Option</span>
										<div>
												<b></b>
											</div>
										</a>
										<div class="chzn-drop"
											style="left: -9000px; width: 494px; top: 28px;">
											<div class="chzn-search">
												<input style="width: 459px;" autocomplete="off" type="text">
											</div>
											<ul class="chzn-results">
												<li id="selTCO_chzn_o_1" class="active-result" style="">Europe</li>
												<li id="selTCO_chzn_o_2" class="active-result" style="">America</li>
												<li id="selTCO_chzn_o_3" class="active-result" style="">Asia</li>
												<li id="selTCO_chzn_o_4" class="active-result" style="">Africa</li>
											</ul>
										</div>
									</div>
									</p>
								</div>
								<div class="_50">
									<p>
										<label for="newsletter"> <input name="newsletter"
											class="required hidden" type="checkbox"><span
											style="-moz-user-select: none;" class="checkbox"><span
												class="mark"><img src="a_data/empty.png">
											</span>
										</span> Recieve newsletter? </label>
									</p>
								</div>
								<div class="_50">
									<p>
										<span class="label">Newsletter type:</span> <label> <input
											name="htmltext" class="required hidden" type="radio"><span
											style="-moz-user-select: none;" class="radio-button"><span
												class="mark"><img src="a_data/empty.png">
											</span>
										</span> Email </label> <label> <input name="htmltext"
											class="required hidden" type="radio"><span
											style="-moz-user-select: none;" class="radio-button"><span
												class="mark"><img src="a_data/empty.png">
											</span>
										</span> HTML </label>
									</p>
								</div>
								<div class="_50">
									<p>
										<label for="file"> Custom file </label>
									<div class="customfile">
										<button class="customfile-button" aria-hidden="true">Browse</button>
										<span class="customfile-feedback" aria-hidden="true">No
											file selected...</span><input name="file"
											class="required customfile-input" type="file">
									</div>
									</p>
								</div>
							</div>
							<div class="actions">
								<div class="actions-left">
									<input type="reset">
								</div>
								<div class="actions-right">
									<input type="submit">
								</div>
							</div>
						</form>
					</div>
				</div>
				<div class="grid_6">
					<div class="box">
						<div class="header">
							<img src="a_data/application-form.png" alt="" height="16"
								width="16">
							<h3>Form with Alternative Style</h3>
							<span></span>
						</div>
						<form novalidate="novalidate" class="validate">
							<div class="content no-padding with-actions">
								<div class="section _100">
									<label> Text field </label>
									<div>
										<input class="required" name="text">
									</div>
								</div>
								<div class="section _100">
									<span class="label">Newsletter type</span>
									<div>
										<div class="input">
											<label> <input class="hidden" name="htmltext"
												type="radio"><span style="-moz-user-select: none;"
												class="radio-button"><span class="mark"><img
														src="a_data/empty.png">
												</span>
											</span> Email </label> <label> <input class="hidden" name="htmltext"
												type="radio"><span style="-moz-user-select: none;"
												class="radio-button"><span class="mark"><img
														src="a_data/empty.png">
												</span>
											</span> HTML </label>
										</div>
									</div>
								</div>
								<div class="section _100">
									<label for="date"> Date Picker </label>
									<div>
										<input value="03/03/2012" id="date"
											class="required hasDatepicker" data-date-relative="now"
											type="date">
									</div>
								</div>
								<div class="section _100">
									<label for="datetime"> Date and Time Picker </label>
									<div>
										<input value="03/03/2012 07:38 " id="datetime"
											class="required hasDatepicker" data-date-relative="now"
											type="datetime">
									</div>
								</div>
								<div class="section _100">
									<label for="time"> Time Picker </label>
									<div>
										<input value="07:38 " id="time" class="required hasDatepicker"
											data-date-relative="now" type="time">
									</div>
								</div>
								<div class="section _100">
									<label for="timeampm"> Time Picker (am/pm) </label>
									<div>
										<input value="07:38 am" id="timeampm"
											class="required hasDatepicker" data-date-relative="now"
											data-timeformat="12" type="time">
									</div>
								</div>
								<div class="section _100">
									<label> Color selection </label>
									<div>
										<input autocomplete="off" maxlength="7" class="miniColors"
											name="color" type="color"><a
											class="miniColors-trigger"
											style="background-color: rgb(255, 255, 255);" href="#"></a>
									</div>
								</div>
							</div>
							<div class="actions">
								<div class="actions-left">
									<input type="reset">
								</div>
								<div class="actions-right">
									<input type="submit">
								</div>
							</div>
						</form>
					</div>
				</div>
				<div class="clear"></div>
				<div class="grid_6">
					<div class="box">
						<div class="header">
							<img src="a_data/task-select-first.png" alt="" height="16"
								width="16">
							<h3>Form with Fieldsets</h3>
							<span></span>
						</div>
						<form novalidate="novalidate" method="get" action=""
							class="validate">
							<div class="content with-actions">
								<fieldset>
									<legend> Fieldset #1 </legend>
									<div class="_50">
										<p>
											<label for="textfield1"> Textfield #1 </label> <input
												class="required" name="textfield1" type="text">
										</p>
									</div>
									<div class="_50">
										<p>
											<label for="textfield2"> Textfield #2 </label> <input
												name="textfield2" class="text" type="text">
										</p>
									</div>
									<div class="_100">
										<p>
											<label for="textfield2"> Textfield #3 </label> <input
												class="required" name="textfield2" type="text">
										</p>
									</div>
								</fieldset>
								<fieldset>
									<legend> Fieldset #2 </legend>
									<p class="inline-small-label">
										<label for="field4"> Textfield #4 </label> <input
											name="field4" class="text" type="text">
									</p>
									<p class="inline-small-label">
										<label for="field5"> Textfield #5 </label> <input
											name="field5" class="text" type="text">
									</p>
								</fieldset>
							</div>
							<div class="actions">
								<div class="actions-left">
									<input type="reset">
								</div>
								<div class="actions-right">
									<input type="submit">
								</div>
							</div>
						</form>
					</div>
				</div>
				<div class="grid_6">
					<div class="box">
						<div class="header">
							<img src="a_data/grid.png" alt="" height="16" width="16">
							<h3>Grid</h3>
							<span></span>
						</div>
						<div class="content">
							<form method="post" action="" class="form" id="form">
								<div class="_100">
									<p>
										<label for="100"> 100% </label> <input id="100" class="text"
											type="text">
									</p>
								</div>
								<div class="_50">
									<p>
										<label for="50"> 50% </label> <input id="50" class="text"
											type="text">
									</p>
								</div>
								<div class="_50">
									<p>
										<label for="50"> 50% </label> <input id="50" class="text"
											type="text">
									</p>
								</div>
								<div class="_25">
									<p>
										<label for="25"> 25% </label> <input id="25" class="text"
											type="text">
									</p>
								</div>
								<div class="_75">
									<p>
										<label for="75"> 75% </label> <input id="75" class="text"
											type="text">
									</p>
								</div>
								<div class="_25">
									<p>
										<label for="25"> 25% </label> <input id="25" class="text"
											type="text">
									</p>
								</div>
								<div class="_25">
									<p>
										<label for="25"> 25% </label> <input id="25" class="text"
											type="text">
									</p>
								</div>
								<div class="_25">
									<p>
										<label for="25"> 25% </label> <input id="25" class="text"
											type="text">
									</p>
								</div>
								<div class="_25">
									<p>
										<label for="25"> 25% </label> <input id="25" class="text"
											type="text">
									</p>
								</div>
							</form>
						</div>
					</div>
				</div>
				<div class="clear"></div>
				<div class="grid_6">
					<div class="box">
						<div class="header">
							<img src="a_data/layer-shape-line.png" alt="" height="16"
								width="16">
							<h3>Inline Form</h3>
							<span></span>
						</div>
						<div class="content">
							<p class="inline-label">
								<label for="field1"> Inline Label </label> <input name="field1"
									type="text">
							</p>
							<p class="inline-medium-label">
								<label for="field2"> Medium Label </label> <input name="field2"
									type="text">
							</p>
							<p class="inline-small-label">
								<label for="field3"> Small Label </label> <input name="field3"
									type="text">
							</p>
							<p class="inline-mini-label">
								<label for="field4"> Mini Label </label> <input name="field4"
									type="text">
							</p>
						</div>
					</div>
				</div>
			</div>
			<div class="clear"></div>
		</div>
		<div class="clear push"></div>
	</div>
	<footer>
		<div class="container_12">
			Copyright © 2011 YourCompany, all rights reserved.
			<div id="button_bar">
				<ul>
					<li><span><a
							href="#">Dashboard</a>
					</span></li>
					<li><span><a href="#">Settings</a>
					</span></li>
				</ul>
			</div>
		</div>
	</footer>
	<script src="a_data/jquery.js"></script>
	<script>
		window.jQuery
				|| document
						.write('<script src="js/libs/jquery-1.7.1.min.js"><\/script>');
	</script>
	<script src="a_data/jquery-ui.js"></script>
	<script>
		window.jQuery.ui
				|| document
						.write('<script src="js/libs/jquery-ui-1.8.16.min.js"><\/script>');
	</script>
	
	<div id="fallr-overlay"></div>
</body>
</html>